.form {
  display: flex;
  max-height: 100%;


  .list-title {
    margin-left: 10px;
    margin-bottom: 6px;
    font-size: 18px;
    font-weight: bold;
    color: #666;
    margin-top: 20px;
  }

  .form-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;


    label {
      font-weight: normal;
      font-size: 14px;
      width: 80px;
      text-align: right;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      transition: color 0.2s ease-in-out;

      .require {
        transition: background-color 0.2s ease-in-out;
        width: 6px;
        height: 6px;
        border-radius: 4px;
        background-color: var(--warn-color);
        display: inline;
        margin-right: 4px;
      }

      .require.err {
        background-color: var(--error-color);
      }
    }

    .err {
      color: var(--error-color);
      font-weight: bold;

      .require {
        background-color: var(--error-color);
      }
    }

    .input {
      min-width: 300px;
    }

  }

  .date-picker {
    position: absolute;
    background: var(--content-background-color);
    /* 半透明 */
    backdrop-filter: blur(10px);
    /* 兼容老版本 Safari */
    -webkit-backdrop-filter: blur(10px);
    right: 20px;
    position: absolute;
    z-index: 99;
    border-radius: 10px;
    margin-top: -10px;
  }

  .projects::-webkit-scrollbar {
    display: none; // 隐藏滚动条;
  }

  .projects {
    overflow: auto;

    .project-item-parent.blue-bg {
      .project-item {
        border: 1px solid var(--primary-color-light);
      }

      &:hover {
        .project-item {
          border: 1px solid transparent;
        }
      }
    }

    .project-item-parent {
      padding: 4px 10px;

      &:hover {
        .project-item {
          transform: scale(1.04);

          .title {
            font-weight: bold;
          }
        }
      }

      .project-item {
        cursor: pointer;
        padding: 10px;
        margin-bottom: 10px;
        border-radius: 10px;
        border: 2px solid transparent;
        background: var(--card-background-color);
        transition: all 0.15s ease-in-out;
        font-weight: normal;
        font-size: 14px;
        color: var(--font-second-color);
        overflow: hidden;

        &:hover {
          background: var(--content-background-color);

          .title {
            font-weight: bold;
            color: var(--font-color);
          }
        }

        .title {
          transition: all 0.15s ease-in-out;
          margin-bottom: 6px;
          color: var(--font-second-color);
          font-weight: bold;

          .tag {
            font-weight: normal;
          }

          .blue.tag {
            background-color: var(--primary-color-light);
            color: var(--primary-color-hover);
          }

          .green.tag {
            background-color: var(--success-color-light);
            color: var(--success-color-hover);
          }

          .gray.tag {
            background-color: var(--gray-color-light);
            color: var(--gray-color-hover);
          }
        }

        .bottom {
          display: flex;
          margin: -10px;
          align-items: center;
          margin-top: 10px;

          .time.error {
            color: var(--error-color);
          }

          .time {
            padding: 6px 12px;
            font-size: 12px;
            background-color: var(--card-background-color);
            border-top-right-radius: 10px;
          }

          .user {
            margin-right: 12px;
            text-align: right;
            font-size: 12px;
            color: var(--font-second-color);
          }
        }

      }
    }
  }
}

.plane-status.plane-status-2 {
  background: var(--warn-color);
  border: 2px solid var(--border-color-light);
}

.plane-status.plane-status-3 {
  background: var(--success-color);
  border: 2px solid var(--border-color-light);
}

.plane-status.plane-status-4 {
  background: var(--error-color);
  border: 2px solid var(--border-color-light);
}

.plane-status {
  width: 14px;
  height: 14px;
  border-radius: 16px;
  background: var(--gray-color-light);
  border: 2px solid var(--border-color-light);
}

.plane {
  padding: 10px;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow: auto;

  .plane-item-hover {
    background-color: rgba(255, 255, 255, 0.4);
  }

  .plane-item {
    display: flex;
    align-items: center;
    margin: 4px 0;
    padding: 6px 8px;
    border-radius: 8px;
    color: var(--font-color);
    cursor: pointer;

    &:hover {
      background-color: var(--card-background-color-hover);
    }


    .plane-content {
      margin-left: 6px;
      margin-right: 2px;
      flex: 1;
      width: 0;
      text-align: left;
    }
  }

}

/deep/ .vc-weeks {
  padding: 0;
}